src/Utils/stringUtils.ts (2)

19-22: Add input validation to capitalize function

The implementation is simple and focused but needs input validation.

Consider this improved implementation:

-export const capitalize = (str: string) => {
+export const capitalize = (str: string): string => {
+  if (!str) return '';
+  if (str.length === 1) return str.toUpperCase();
+
   return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
 };

---

1-22: Consider enhancing module documentation and testing

While the utility functions provide a good foundation for replacing lodash, consider these improvements:

1. Add JSDoc comments with examples for each function
2. Create a comprehensive test suite covering edge cases
3. Consider adding TypeScript strict type checks
4. Add a module-level comment explaining the purpose of this utility file

Would you like me to help generate:

1. JSDoc documentation with examples?
2. A test suite for these utilities?

src/Utils/Notifications.js (1)

Line range hint 44-54: Add tests for error message formatting

The error message formatting logic uses the newly implemented string utility functions in a critical path. We should ensure the formatting behavior remains consistent after removing lodash.

Consider adding test cases for the following scenarios:

1. Complex object keys that need camelCase transformation
2. Various error message formats
3. Edge cases like empty strings or special characters

Example test cases:

const testCases = [
  { 'user_name': ['Invalid'] },
  { 'COMPLEX_ERROR_KEY': ['Error 1', 'Error 2'] },
  { 'nested.key.path': ['Test error'] }
];

Would you like me to help create a comprehensive test suite for this functionality?

src/components/Patient/DiagnosesFilter.tsx (2)

37-53: Consider enhancing the useDebounce hook with cleanup and stronger typing.

The implementation is correct and follows React hooks best practices. However, consider these improvements:

-function useDebounce(callback: (...args: any[]) => void, delay: number) {
+function useDebounce<T extends (...args: any[]) => void>(
+  callback: T,
+  delay: number
+) {
   const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   const debouncedCallback = useCallback(
-    (...args: any[]) => {
+    (...args: Parameters<T>) => {
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
       }
       timeoutRef.current = setTimeout(() => {
         callback(...args);
       }, delay);
     },
     [callback, delay],
   );
 
+  useEffect(() => {
+    return () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, []);
 
   return debouncedCallback;
 }

Changes suggested:

1. Add cleanup in useEffect to prevent memory leaks
2. Add generic type parameter for better type inference
3. Use Parameters utility type to maintain type safety of arguments

---

89-91: LGTM! Consider adding type safety to the query parameter.

The implementation successfully replaces lodash's debounce with the custom hook while maintaining the same functionality.

-  const debouncedQuery = useDebounce((query: string) => {
+  const debouncedQuery = useDebounce((query: string): void => {
     refetch({ query: { query } });
   }, 300);

Also applies to: 113-113

src/components/Facility/Investigations/Reports/utils.tsx (2)

15-42: Enhance type safety in data transformation

The implementation effectively uses native JS methods, but type safety could be improved by avoiding any types.

Consider these type improvements:

-  data.map((value: any) => [
+  data.map((value: InvestigationResponse[number]) => [

-  (acc, value: any) => {
+  (acc: { [key: string]: InvestigationResponse }, value: InvestigationResponse[number]) => {

---

Line range hint 89-108: Improve maintainability of color index calculation

The color index calculation uses magic numbers and could benefit from better documentation and constants.

Consider these improvements:

+ const COLOR_INDICES = {
+   YELLOW: 1,
+   GREEN: 5,
+   RED: 7,
+   INVALID: -1,
+   BUCKET_COUNT: 3
+ } as const;
+
+ /**
+  * Calculates color index based on value's position relative to min/max bounds
+  * @returns 
+  * - 1-2: Low range (yellow)
+  * - 3-5: Normal range (green)
+  * - 6-8: High range (red)
+  * - -1: Invalid input
+  */
  export const getColorIndex = memoize(
    ({ max, min, value }: { min?: number; max?: number; value?: number }) => {
      if (!max && min && value) {
-       return value < min ? 1 : 5;
+       return value < min ? COLOR_INDICES.YELLOW : COLOR_INDICES.GREEN;
      }
      // ... apply similar changes to other conditions

src/components/Form/Form.tsx (1)

60-65: LGTM! Successfully replaced lodash with native JavaScript.

The implementation correctly replaces lodash-es's omitBy with native JavaScript methods while maintaining the same functionality. The type assertion ensures type safety.

Consider extracting the filtering logic into a utility function for better maintainability and reusability:

+const filterNonEmptyEntries = <T extends Record<string, any>>(obj: T) =>
+  Object.fromEntries(
+    Object.entries(obj).filter(
+      ([_key, value]) => value !== "" && value !== null && value !== undefined
+    )
+  ) as T;

 const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
   event.preventDefault();
   event.stopPropagation();

   if (validate) {
-    const errors = Object.fromEntries(
-      Object.entries(validate(state.form)).filter(
-        ([_key, value]) =>
-          value !== "" && value !== null && value !== undefined,
-      ),
-    ) as FormErrors<T>;
+    const errors = filterNonEmptyEntries(validate(state.form)) as FormErrors<T>;

src/components/Facility/Investigations/Table.tsx (1)

62-69: Add error handling for invalid paths

The function assumes the path is always valid but should handle edge cases gracefully.

Consider adding these safety checks:

 const handleValueChange = (value: any, name: string) => {
+  if (!name || typeof name !== 'string') {
+    console.error('Invalid path provided');
+    return;
+  }
   const form = { ...state };
   const keys = name.split(".");
+  if (keys.length === 0) {
+    console.error('Empty path provided');
+    return;
+  }
   let current = form;
   for (let i = 0; i < keys.length - 1; i++) {
     const key = keys[i];
     if (!current[key]) current[key] = {};
     current = current[key];
   }
   current[keys[keys.length - 1]] = value;
   dispatch({ type: "set_form", form });
 };

🧰 Tools

🪛 GitHub Check: CodeQL

[warning] 69-69: Prototype-polluting function
The property chain here is recursively assigned to current without guarding against prototype pollution.

src/components/Facility/Investigations/ShowInvestigation.tsx (1)

159-171: LGTM! Consider minor optimization for readability

The native JavaScript implementation successfully replaces lodash functionality. The code is clear and maintainable.

Optional: Consider this slightly more concise version using object property shorthand:

 const changedValues = Object.keys(state.initialValues).reduce(
   (acc: any, key: any) => {
     const val = state.initialValues[key];
+    const value = val?.value || null;
+    const notes = val?.notes || null;
     acc[key] = {
-      id: val?.id,
-      initialValue: val?.notes || val?.value || null,
-      value: val?.value || null,
-      notes: val?.notes || null,
+      id: val?.id,
+      initialValue: notes || value || null,
+      value,
+      notes,
     };
     return acc;
   },
   {},
 );

src/components/Form/AutoCompleteAsync.tsx (3)

Line range hint 71-92: Implementation of custom debouncing looks good, but consider memory leak prevention

The replacement of lodash's debounce with native setTimeout is well implemented. However, we should ensure cleanup when the component unmounts.

Consider adding a cleanup function in useEffect to prevent potential memory leaks:

  useEffect(() => {
    fetchDataAsync(query);
+   return () => {
+     clearTimeout(timeoutId);
+   };
  }, [query, fetchDataAsync]);

---

Line range hint 78-90: Consider error handling for failed API calls

The async operation inside setTimeout should include error handling to ensure the loading state is properly reset even when the API call fails.

Add try-catch block:

      timeoutId = setTimeout(async () => {
+       try {
          const data = ((await fetchData(query)) || [])?.filter((d: any) =>
            filter ? filter(d) : true,
          );

          if (showNOptions !== undefined) {
            setData(data.slice(0, showNOptions));
          } else {
            setData(data);
          }
+       } catch (error) {
+         console.error('Failed to fetch autocomplete data:', error);
+         setData([]);
+       } finally {
          setLoading(false);
+       }
      }, debounceTime);

---

Line range hint 14-39: Consider strengthening TypeScript types

The Props interface uses any types in several places which reduces type safety. Consider creating more specific types for the data structure.

Example improvement:

interface Option {
  id: string | number;
  label: string;
  [key: string]: any; // for additional properties
}

interface Props<T extends Option = Option> {
  // ... other props
  selected: T | T[];
  fetchData: (search: string) => Promise<T[]> | undefined;
  onChange: (selected: T | T[] | null) => void;
  optionLabel?: (option: T) => string;
  // ... rest of the props
}

src/components/Patient/SampleTestCard.tsx (1)

104-104: Consider using meaningful default values

While adding null checks is good, using empty strings as fallbacks might not be the most user-friendly approach. Consider using more descriptive defaults that indicate the absence of data.

-              {startCase(camelCase(itemData.status || ""))}
+              {startCase(camelCase(itemData.status || "Not Set"))}

-              {startCase(camelCase(itemData.result || ""))}
+              {startCase(camelCase(itemData.result || "Pending"))}

Also applies to: 136-136

src/components/Common/ExcelFIleDragAndDrop.tsx (2)

70-72: Consider enhancing date handling robustness

The current date conversion logic could benefit from some improvements:

1. Add validation for invalid dates
2. Consider timezone handling
3. Avoid direct mutation of the row object
4. Extract to a separate utility function

Consider refactoring to something like this:

+ const convertExcelDate = (date: Date): string => {
+   if (!(date instanceof Date) || isNaN(date.getTime())) {
+     return '';
+   }
+   return date.toISOString().split('T')[0];
+ };

  data.forEach((row: any) => {
-   Object.keys(row).forEach((key) => {
-     if (row[key] instanceof Date) {
-       row[key] = row[key].toISOString().split("T")[0];
-     }
-   });
+   const convertedRow = { ...row };
+   Object.keys(convertedRow).forEach((key) => {
+     if (convertedRow[key] instanceof Date) {
+       convertedRow[key] = convertExcelDate(convertedRow[key]);
+     }
+   });
+   return convertedRow;
  });

---

70-72: Enhance type safety by removing any types

The current implementation uses any types which reduces type safety. Consider defining proper interfaces for the Excel data structure.

Consider adding these types:

interface ExcelRow {
  [key: string]: string | Date | number;
}

interface ExcelData extends Array<ExcelRow> {}

Then update the code:

- data.forEach((row: any) => {
+ data.forEach((row: ExcelRow) => {

src/components/Facility/Investigations/Reports/index.tsx (1)

181-190: Well-implemented lodash removal with native JavaScript methods!

The refactoring effectively replaces lodash methods with native JavaScript equivalents. The implementation is clean and maintains the original functionality while reducing external dependencies.

A few suggestions to make the code even more maintainable:

-    const investigationList = Array.from(
-      data
-        .flatMap((i) => i?.data?.results || [])
-        .map((i) => ({
-          ...i,
-          name: `${i.name} ${i.groups[0].name ? " | " + i.groups[0].name : ""}`,
-        }))
-        .reduce((map, item) => map.set(item.external_id, item), new Map())
-        .values(),
-    );
+    // Extract results and handle potential null/undefined data
+    const flattenedResults = data.flatMap((i) => i?.data?.results || []);
+    
+    // Create a Map for unique entries by external_id
+    const uniqueInvestigations = new Map(
+      flattenedResults.map((i) => [
+        i.external_id,
+        {
+          ...i,
+          name: `${i.name}${i.groups[0]?.name ? ` | ${i.groups[0].name}` : ''}`,
+        },
+      ])
+    );
+    
+    const investigationList = Array.from(uniqueInvestigations.values());

Changes suggested:

1. Split the chain into meaningful steps for better readability
2. Use optional chaining for groups[0]?.name to prevent potential null reference
3. Use template literals more consistently
4. Add comments to explain the data transformation steps

src/components/Patient/SampleDetails.tsx (1)

Line range hint 385-385: Add null checks for consistency with other string transformations.

Similar to the changes in renderFlow, consider adding null checks to other instances of string transformations to maintain consistency and prevent potential runtime errors:

- {startCase(camelCase(sampleDetails.doctor_name))}
+ {startCase(camelCase(sampleDetails.doctor_name || ""))}

- {startCase(camelCase(sampleDetails.sample_type))}
+ {startCase(camelCase(sampleDetails.sample_type || ""))}

Also applies to: 461-461

src/components/Patient/PatientRegister.tsx (1)

762-762: Memoize duplicateCheck to prevent unnecessary recreations.

To avoid recreating the debounced function on every render, wrap duplicateCheck with useCallback. This ensures that duplicateCheck maintains referential equality between renders unless its dependencies change.

Apply this diff to memoize duplicateCheck:

- const duplicateCheck = useDebounce(async (phoneNo: string) => {
+ const duplicateCheck = useCallback(
+   useDebounce(async (phoneNo: string) => {
      // function body
    }, 300),
+   []
+ );

Configuration used: CodeRabbit UI
Review profile: CHILL

-export const camelCase = (str: string) => {
+export const camelCase = (str: string): string => {
+  if (!str) return '';
+
   return str
-    .replace(/(?:^\w|[A-Z]|\b\w|\s+)/g, (match, index) =>
-      index === 0 ? match.toLowerCase() : match.toUpperCase(),
-    )
-    .replace(/\s+/g, "")
-    .replace(/([A-Z])/g, (match) => match.toLowerCase());
+    .toLowerCase()
+    .replace(/[^a-zA-Z0-9]+(.)/g, (_, char) => char.toUpperCase());
 };

export const camelCase = (str: string): string => {
  if (!str) return '';
  return str
    .toLowerCase()
    .replace(/[^a-zA-Z0-9]+(.)/g, (_, char) => char.toUpperCase());
};

#!/bin/bash
# Find test files that might contain lodash camelCase usage examples
rg -l "\.camelCase\(" | grep -i "test\|spec"

#!/bin/bash
# Let's search for any tests or usage of camelCase function
rg -l "camelCase"

# Also search for any lodash imports to understand the context of migration
rg "from 'lodash'" -A 1

#!/bin/bash
# Let's check the actual usage of camelCase in the files to understand the context
rg "camelCase" -B 2 -A 2 scripts/setup-care-apps.js src/components/Patient/SampleTestCard.tsx src/components/Patient/SampleDetails.tsx src/Utils/Notifications.js

# Also check if there are any lodash imports with different syntax
rg "lodash" -B 1 -A 1

#!/bin/bash
# Let's check how camelCase is actually being used in the codebase
rg -B 2 -A 2 "camelCase\(" src/

# Also check if there are any existing tests for stringUtils
fd "stringUtils" -e test.ts -e spec.ts

#!/bin/bash
# Description: Verify the stringUtils implementation exists and contains required functions

# Check if stringUtils file exists in the same directory
fd -e js -e ts "stringUtils" "src/Utils"

# Check implementation of required functions
rg -A 10 "export.*(camelCase|startCase)" "src/Utils"

#!/bin/bash
# Check how these functions are used in Notifications.js
rg -A 5 "(camelCase|startCase)" "src/Utils/Notifications.js"

# Also check if there are any tests for these string utilities
fd -e test.js -e test.ts -e spec.js -e spec.ts "stringUtils" .

#!/bin/bash
# Description: Check for any remaining lodash imports and dependencies

# Check for lodash imports in TypeScript/JavaScript files
echo "Checking for lodash imports..."
rg -l "import.*lodash" -t ts -t tsx -t js

# Check package.json for lodash dependencies
echo "Checking package.json for lodash dependencies..."
if [ -f "package.json" ]; then
    jq '.dependencies + .devDependencies | with_entries(select(.key | contains("lodash")))' package.json
fi

#!/bin/bash
# Description: Check for any remaining lodash imports with correct file type flags
echo "Checking for lodash imports..."
rg -l "import.*lodash" --type-add 'tsx:*.tsx' --type-add 'ts:*.ts' --type-add 'js:*.js' -t tsx -t ts -t js

# Check if lodash is used without import statements (e.g., require)
echo "Checking for lodash requires..."
rg -l "require.*lodash" --type-add 'tsx:*.tsx' --type-add 'ts:*.ts' --type-add 'js:*.js' -t tsx -t ts -t js

# Check for any remaining lodash usage patterns
echo "Checking for lodash usage patterns..."
rg -l "lodash" --type-add 'tsx:*.tsx' --type-add 'ts:*.ts' --type-add 'js:*.js' -t tsx -t ts -t js

#!/bin/bash
# Search for routes that import or use the Investigation Reports component
rg -l "Investigations/Reports" | grep -i "route"

#!/bin/bash
# Check the route configuration in PatientRoutes.tsx
rg -A 10 "Investigations/Reports" src/Routers/routes/PatientRoutes.tsx

#!/bin/bash
# Check the route path configuration for InvestigationReports
rg -B 5 -A 5 "InvestigationReports" src/Routers/routes/PatientRoutes.tsx

#!/bin/bash
# Check for any remaining lodash imports in this file and related components
echo "Checking for lodash imports..."
rg -l "lodash" "src/components/Facility/Investigations"

echo "Checking package.json for lodash dependencies..."
cat package.json | jq '.dependencies | keys[] | select(contains("lodash"))'

#!/bin/bash
# Check the specific file for any lodash usage
echo "Checking Table.tsx for lodash..."
rg "lodash" "src/components/Facility/Investigations/Table.tsx"

# Check if lodash is used in imports or as _ anywhere in the file
echo -e "\nChecking for potential lodash usage as _..."
rg "import.*{.*_.*}" "src/components/Facility/Investigations/Table.tsx"
rg "import.*_ from" "src/components/Facility/Investigations/Table.tsx"

# Check if package.json exists and has lodash
echo -e "\nChecking if package.json exists and contains lodash..."
if [ -f "package.json" ]; then
    echo "Content of dependencies in package.json:"
    cat package.json | jq '.dependencies'
fi

# Check the entire codebase for lodash imports
echo -e "\nChecking entire codebase for lodash imports..."
rg "from ['\"]lodash['\"]|from ['\"]lodash/|require\(['\"]lodash['\"]" -l

#!/bin/bash
# Check for any lodash-related strings in the specific file
echo "Checking Table.tsx for any lodash references..."
rg -i "lodash" "src/components/Facility/Investigations/Table.tsx"

# Check for potential lodash usage patterns in the file
echo -e "\nChecking for potential lodash usage patterns..."
rg "import.*_" "src/components/Facility/Investigations/Table.tsx"
rg "from.*lodash" "src/components/Facility/Investigations/Table.tsx"

# Simple check for lodash in the entire codebase
echo -e "\nChecking codebase for lodash..."
rg -l "lodash"

#!/bin/bash
# Search for other async components with loading states
rg -l "setLoading.*true.*setTimeout" --type tsx

#!/bin/bash
# Search for loading state patterns in TypeScript/React files with broader file extensions
rg -l "setLoading\(true\)" --type ts --type tsx --type jsx

# Look for debounce patterns with loading states
rg "setLoading.*setTimeout|setTimeout.*setLoading" --type ts --type tsx --type jsx -A 5

# Search for similar autocomplete components
rg "AutoComplete.*async" --type ts --type tsx --type jsx -A 5

#!/bin/bash
# Search for loading state patterns in all files
rg -l "setLoading\(true\)"

# Look for debounce patterns with loading states
rg "setLoading.*setTimeout|setTimeout.*setLoading" -A 5

# Search for the current component implementation
rg "class.*AutoCompleteAsync|function.*AutoCompleteAsync" -A 10

# Find any debounce implementations
rg "clearTimeout.*timeoutId" -A 5

#!/bin/bash
# Let's examine the complete implementation of AutoCompleteAsync to understand the loading state management
cat src/components/Form/AutoCompleteAsync.tsx

# Also check SearchInput implementation for comparison of debounce pattern
cat src/components/Form/SearchInput.tsx

#!/bin/bash
# Description: Verify the implementation of camelCase and startCase in stringUtils

# Check if the utility functions exist and their implementation
fd --type f stringUtils.ts --exec cat {} \; 

# Look for tests of these utilities
fd --type f "stringUtils.test" --exec cat {} \;

#!/bin/bash
# Let's verify if these utility functions are being used correctly in the component
rg -A 2 "camelCase|startCase" "src/components/Patient/SampleTestCard.tsx"

# Also check if there are any tests for stringUtils in other test file formats
fd --type f "stringUtils" --extension test.ts --extension test.tsx --extension spec.ts --extension spec.tsx --exec cat {} \;

#!/bin/bash
# Description: Check for any remaining lodash imports or usage
rg "lodash|_\." "src/components/Common/ExcelFIleDragAndDrop.tsx"

#!/bin/bash
# Let's verify the file content to ensure no lodash dependencies remain
cat "src/components/Common/ExcelFIleDragAndDrop.tsx"

#!/bin/bash
# Description: Verify the structure of investigation data across the codebase

# Check for investigation type definitions
echo "Checking investigation type definitions..."
rg -t typescript "type.*Investigation.*=.*{" -A 10

# Check for investigation object usage
echo "Checking investigation object usage..."
rg -t typescript "investigation.*\.external_id|investigation.*\.name|investigation.*\.groups"

#!/bin/bash
# Search for type definitions related to investigations
echo "Searching for investigation type definitions..."
rg "type\s+Investigation" -A 10

# Search for interfaces related to investigations
echo "Searching for investigation interfaces..."
rg "interface\s+Investigation" -A 10

# Check usage of investigation properties
echo "Checking investigation property usage..."
rg "\.external_id|\.name|\.groups\[0\]"

# Look for investigation data transformations
echo "Checking data transformations..."
rg "flatMap.*results|\.reduce.*Map.*external_id"

#!/bin/bash
# Description: Check for any remaining lodash imports in the codebase
# and verify the consistency of string utility usage

# Check for any remaining lodash imports in this file
echo "Checking for remaining lodash imports in SampleDetails.tsx..."
rg "from ['\"]lodash" "src/components/Patient/SampleDetails.tsx"

# Check for similar string utility usage patterns in related files
echo "Checking for similar string utility usage patterns..."
rg "startCase\(camelCase\(" "src/components/Patient/"

# Verify the implementation of local string utilities
echo "Verifying local string utility implementations..."
cat "src/Utils/stringUtils.ts"

src/components/Facility/Investigations/Reports/utils.tsx (1)

Line range hint 25-96: Improve type safety and code organization in data transformation.

While the implementation is efficient, there's heavy usage of any types which reduces type safety. Consider breaking down the complex transformation into smaller, well-typed functions.

Here's a suggested approach:

interface SessionObject {
  session_external_id: string;
  session_created_date: string;
  facility_name?: string;
  facility_id?: string;
  [key: string]: any;
}

interface InvestigationValue {
  session_object: SessionObject;
  consultation_object?: {
    facility_name?: string;
    facility?: string;
  };
  investigation_object: {
    external_id: string;
    min_value?: number;
    max_value?: number;
  };
  value?: number;
  notes?: string;
}

const createSessionMap = (data: InvestigationValue[]) => {
  return Array.from(
    new Map(
      data.map((value) => [
        value.session_object.session_external_id,
        {
          ...value.session_object,
          facility_name: value.consultation_object?.facility_name,
          facility_id: value.consultation_object?.facility,
        },
      ]),
    ).values(),
  ).sort(
    (a, b) =>
      new Date(b.session_created_date).getTime() -
      new Date(a.session_created_date).getTime(),
  );
};

src/components/Facility/Investigations/Table.tsx (1)

62-80: Consider type safety and documentation improvements

While the implementation successfully replaces lodash.set, consider these enhancements:

1. Replace value: any with a more specific type
2. Add JSDoc documentation describing the function's purpose and parameters
3. Consider extracting this to a reusable utility function since other components might need similar lodash.set replacements

+/**
+ * Updates a nested object property using dot notation
+ * @param value - The value to set
+ * @param name - The property path in dot notation (e.g., "a.b.c")
+ */
-const handleValueChange = (value: any, name: string) => {
+const handleValueChange = (value: string | number, name: string) => {

🧰 Tools

🪛 GitHub Check: CodeQL

[warning] 80-80: Prototype-polluting function
The property chain here is recursively assigned to current without guarding against prototype pollution.

Configuration used: CodeRabbit UI
Review profile: CHILL

#!/bin/bash
# Description: Check for any remaining lodash string utility imports and compare behavior

# Check for any remaining lodash string utility imports
echo "Checking for remaining lodash string utility imports..."
rg -l "import.*\{.*(camelCase|startCase|capitalize).*\}.*from.*lodash"

# Find all files that previously used these lodash functions
echo "Files previously using these lodash functions..."
git log -p | rg -B 2 "import.*\{.*(camelCase|startCase|capitalize).*\}.*from.*lodash"

#!/bin/bash
# Check current usage in the identified files
echo "Checking SampleDetails.tsx..."
rg -A 2 "(camelCase|startCase|capitalize)" "src/components/Patient/SampleDetails.tsx" || echo "File not found"

echo -e "\nChecking SampleTestCard.tsx..."
rg -A 2 "(camelCase|startCase|capitalize)" "src/components/Patient/SampleTestCard.tsx" || echo "File not found"

# Also check for any current imports of these functions from lodash
echo -e "\nChecking current lodash imports in these files..."
rg "import.*lodash" "src/components/Patient/SampleDetails.tsx" "src/components/Patient/SampleTestCard.tsx" || echo "No lodash imports found"

# Check if these files are using our new utility functions
echo -e "\nChecking for imports from stringUtils..."
rg "import.*stringUtils" "src/components/Patient/SampleDetails.tsx" "src/components/Patient/SampleTestCard.tsx" || echo "No stringUtils imports found"

src/Utils/stringUtils.ts (3)

1-1: Enhance function documentation with examples

Consider adding examples to make the function's behavior more clear:

-// Converts a string to camelCase format, first word - lowercase and each subsequent word - uppercase letter, with no spaces.
+// Converts a string to camelCase format (e.g., "hello world" → "helloWorld", "foo-bar" → "fooBar", "FOO_BAR" → "fooBar")

---

19-19: Optimize word capitalization logic

The current word capitalization can be optimized by avoiding array access and using charAt:

-    .map((word) => (word ? word[0].toUpperCase() + word.slice(1) : ""))
+    .map((word) => (word ? word.charAt(0).toUpperCase() + word.slice(1) : ""))

---

23-28: LGTM! Consider adding an example to the documentation

The implementation is robust and efficient. As a minor enhancement, consider adding an example to the documentation:

-// Capitalize the first letter of a string
+// Capitalize the first letter of a string (e.g., "hello" → "Hello")

Configuration used: CodeRabbit UI
Review profile: CHILL

Configuration used: CodeRabbit UI
Review profile: CHILL

src/components/Patient/PatientRegister.tsx (1)

Line range hint 756-781: Consider adding a reasonable debounce delay.

The current implementation uses a 0ms delay, which effectively removes the debouncing effect. This could lead to unnecessary API calls on every keystroke when checking for duplicate patients.

Consider adding a reasonable delay (e.g., 300ms) to reduce API calls:

  const duplicateCheck = useDebounce(async (phoneNo: string) => {
    if (
      phoneNo &&
      PhoneNumberValidator()(parsePhoneNumber(phoneNo) ?? "") === undefined
    ) {
      const query = {
        phone_number: parsePhoneNumber(phoneNo),
      };
      const { res, data } = await request(routes.searchPatient, {
        query,
      });
      if (res?.ok && data?.results) {
        const duplicateList = !id
          ? data.results
          : data.results.filter(
              (item: DupPatientModel) => item.patient_id !== id,
            );
        if (duplicateList.length) {
          setStatusDialog({
            show: true,
            patientList: duplicateList,
          });
        }
      }
    }
-  }, 0);
+  }, 300);

Configuration used: CodeRabbit UI
Review profile: CHILL

src/hooks/useDebounce.ts (1)

12-22: Optimize implementation and prevent unnecessary re-renders

The core debounce logic is correct, but consider these optimizations:

1. Simplify timeoutRef type
2. Memoize the debounced callback to prevent unnecessary re-renders in parent components

Consider this optimized implementation:

-const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-const debouncedCallback = (...args: string[]) => {
+const timeoutRef = useRef<NodeJS.Timeout>();
+const debouncedCallback = useCallback((...args: T) => {
   if (timeoutRef.current) {
     clearTimeout(timeoutRef.current);
   }
   timeoutRef.current = setTimeout(() => {
     callbackRef.current(...args);
   }, delay);
-};
+}, [delay]);

Don't forget to add the useCallback import:

-import { useEffect, useRef } from "react";
+import { useEffect, useRef, useCallback } from "react";

src/components/Patient/PatientRegister.tsx (2)

Line range hint 1-1500: Add data sanitization for sensitive healthcare information.

The form handles sensitive healthcare data but lacks proper sanitization before submission. Consider adding sanitization for fields like:

• Patient name
• Address
• Medical history details

Would you like me to provide an implementation for a data sanitization utility?

---

Line range hint 1-1500: Consider internationalizing error messages.

Several error messages are hardcoded in English. For consistency with the rest of the application that uses i18n, these should be moved to translation files.

Examples:

• "Please enter valid phone number"
• "Please select a blood group"
• "Please fill the medical history"

Configuration used: CodeRabbit UI
Review profile: CHILL

#!/bin/bash
# Description: Find all usages of useDebounce hook and verify implementation

# Find direct imports of useDebounce
echo "Direct imports of useDebounce:"
rg "import.*useDebounce.*from.*hooks/useDebounce"

# Find usage patterns
echo -e "\nUsage patterns:"
rg "useDebounce\(" -A 3

# Check for any remaining lodash debounce usage
echo -e "\nCheck for remaining lodash debounce usage:"
rg "import.*\{.*debounce.*\}.*from.*lodash"

 useEffect(() => {
   callbackRef.current = callback;
 }, [callback]);

+useEffect(() => {
+  return () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+  };
+}, [delay]);

Configuration used: CodeRabbit UI
Review profile: CHILL

+/**
+ * Creates an object composed of the properties the predicate returns truthy for.
+ * The predicate is invoked with the value of each property.
+ *
+ * @param obj - The source object
+ * @param predicate - The function invoked per property
+ * @returns Returns the new object
+ * @throws {TypeError} If first argument is not an object
+ */
 export function omitBy<T extends Record<string, unknown>>(
   obj: T,
-  predicate: (value: unknown) => boolean,
+  predicate: (value: unknown) => boolean = isEmpty,
 ): Partial<T> {
+  if (!obj || typeof obj !== 'object') {
+    throw new TypeError('First argument must be an object');
+  }
   return Object.fromEntries(
-    Object.entries(obj).filter(([_, value]) => !predicate(value)),
+    Object.entries(obj).filter(([_, value]) => predicate(value)),
   ) as Partial<T>;
 }